<template>
  <div>
    <a-modal
      title="分配学管师"
      :visible="visible"
      :confirm-loading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <a-spin :spinning="loading">
        <a-table :columns="columns" :data-source="data" :rowSelection="rowSelection" :pagination="false" :bodyStyle="{'max-height':'400px','overflow-y':'auto'}" style="border:1px solid #e8e8e8;"></a-table>
      </a-spin>
    </a-modal>
  </div>
</template>

<script>
import { userList, arrangeUser } from '@/api/user'
export default {
  name: 'userModalManager',
  data() {
    return {
      loading: false,
      confirmLoading: false,
      visible: false,
      studentIDs: [],
      columns: [
        {
          title: '学管师',
          dataIndex: 'name'
        },
        {
          title: '手机号',
          dataIndex: 'phone'
        },
        {
          title: '已分配在读学员',
          dataIndex: 'student_academic_supervisor'
        }
      ],
      data: [],
      user:null,
    }
  },
  computed: {
    rowSelection() {
      return {
        onChange: (selectedRowKeys, selectedRows) => {
          this.user = selectedRows[0].user_id
        },
        type: 'radio'
      }
    }
  },
  methods: {
    showModal(arr) {
      this.loading = true
      this.visible = true
      this.studentIDs = arr
      userList({
        school_id: this.$store.state.user.school
      }).then(res => {
        this.data = res
        this.$forceUpdate()
        this.loading = false
      })
    },
    handleCancel() {
      this.visible = false
    },
    handleOk() {
      if (this.user==null) {
        this.$message.error('请选择学管师')
        return
      }
      this.confirmLoading = true
      arrangeUser({
        student_ids: this.studentIDs,
        academic_supervisor: this.user
      })
        .then(res => {
          this.$message.success('分配成功')
          this.confirmLoading = false
          this.visible = false
          this.$emit('reload', res)
        })
        .catch(err => {
          this.confirmLoading = false
          this.$message.error(err.data.message || '分配跟进人失败')
        })
    }
  },
  watch: {
    visible(val) {
      if (val == false) {
        this.studentIDs = []
      }
    }
  }
}
</script>

<style lang="less" scoped>
</style>